import 'package:flutter/material.dart';
void main() => runApp(TextApp());

///应用的根布局
class TextApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    ///构建Materia Desin 风格的应用程序
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        brightness: Brightness.light,
        ///主题是蓝色
        colorSchemeSeed: Colors.blue,
        //启用
        useMaterial3: true,
      ),
      ///默认的首页面
      home: NavaHomePage1(),
    );
  }
}
/// 2022年更新  适配 flutter 3.3.5 版本以上
/// 在业务开发中，开发者开发的业务中可能会用不到某一块的技术，但是小编建议，用不到的时候，可以顺便看看，当用到的时候就有足够的知识储备了，
/// 你可通会说，这会看了，时间长了就忘记了，小编要说的是，忘记不怕，你可以收藏或者关注我，当你忘记的时候，可以回来一看，小编会每周不定时更新内容
/// 每周必然会有更新，这是程序员的动力
class NavaHomePage1 extends StatefulWidget {
  const NavaHomePage1({super.key});

  @override
  State<StatefulWidget> createState() {
    return _NavaHomePageState();
  }
}

class _NavaHomePageState extends State<NavaHomePage1> {
  ///当前显示的页面角标
  int _currentIndex = 0;
  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        title: Text("底部导航"),
      ),
      body: Text("这里是body $_currentIndex"),
      //底部导航栏
      bottomNavigationBar: NavigationBar(
        //菜单组
        destinations: navigationList,
        //当前选中的
        selectedIndex:_currentIndex ,
        //选择点击事件
        onDestinationSelected: (int index){
          setState(() {
            _currentIndex = index;
          });
        },
        //背景颜色
        backgroundColor: Colors.white,
        //表面覆盖的一层浅色
        surfaceTintColor: Colors.red,
      ),
    );
  }

  static const List<NavigationDestination> navigationList = [
    NavigationDestination(
      tooltip: "",
      icon: Icon(Icons.widgets_outlined),
      label: "菜单",
      selectedIcon: Icon(Icons.widgets),

    ),
    NavigationDestination(
      tooltip: "",
      icon: Icon(Icons.file_open_outlined),
      label: "发现",
      selectedIcon: Icon(Icons.file_open),

    ),
    NavigationDestination(
      tooltip: "",
      icon: Icon(Icons.text_fields),
      label: "列表",
      selectedIcon: Icon(Icons.text_fields_outlined),

    ),
    NavigationDestination(
      tooltip: "",
      icon: Icon(Icons.people_alt_outlined),
      label: "我的",
      selectedIcon: Icon(Icons.people),

    )
  ];
}
